<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>财富管理中心</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <#include "public/css.ftl">

</head>
<body class="hold-transition skin-blue sidebar-mini">
<#include "public/tip.ftl">
<div class="wrapper">
  <#include "public/header.ftl">
  <!-- Left side column. contains the logo and sidebar -->
  <#include "public/aside.ftl">
  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        Data Tables
        <small>advanced tables</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li class="active">#</li>
        <li class="active">#</li>
      </ol>
    </section>
    <!-- Main content -->
    <section class="content"> 
      <div class="row">
        <div class="col-xs-12"> 
          <div class="box">
            <div class="box-header">
              <h3 class="box-title">客户列表</h3>
            </div>
            <div class="box-body">
              <div id="toolbar">
                <div class="form-inline" role="form">
                  <a class="btn btn-app" onclick="showAddCustModel(-1)">
                    <i class="fa fa-plus"></i> 新增
                  </a>

                  <a class="btn btn-app" onclick="refresh_111()">
                    <i class="fa fa-plus"></i> 刷新
                  </a>
                </div>
              </div>
              <table id="table" data-toggle="table" data-url="/cust/list" date-class=".table-responsive table text-nowrap"
                     data-search="true" data-pagination="true" data-page-list="[5,10]" data-sort-name="id" data-show-columns="true" data-show-refresh="true"
                     data-show-toggle="true" data-show-columns="true" data-show-export="true">
<#--                data-sortable 设置当前列是否可排序，默认当前显示内容排序  sortable: true -->
<#--                data-sort-name 设置默认排序列名-->
<#--                data-sort-order 设置默认排序方式 asc/desc-->

<#--                data-show-columns 设置是否开启显示列,默认为false-->
<#--                data-switchable 设置是否参与显示隐藏-->
<#--                data-visible 设置默认是否显示-->
<#--                data-height 设置table表格固定高度-->
<#--                data-card-view 设置table 的显示方式是否是card view-->

<#--                data-search 是否显示搜索框-->
<#--                data-show-refresh 是否像是刷新按钮,注：刷新操作会重新请求数据，并带着请求参数-->
<#--                data-show-toggle 是否显示面板切换按钮-->
<#--                data-show-columns 是否显示列控制按钮-->

<#--                data-search 是否显示搜索框-->
<#--                data-show-refresh 是否像是刷新按钮,注：刷新操作会重新请求数据，并带着请求参数-->
<#--                data-show-toggle 是否显示面板切换按钮-->
<#--                data-show-columns 是否显示列控制按钮-->

                <thead>
                <tr>
<#--                  <th data-checkbox="true">多选</th>-->
<#--                  <th data-radio="true">单选</th>-->
                  <th data-field="id" data-formatter="type">客户ID</th>
                  <th data-field="name" data-formatter="custUpdate">姓名</th>
                  <th data-field="sex">性别</th>
                  <th data-field="newBirth">生日</th>
                  <th data-field="phone">电话</th>
                  <th data-field="email">邮箱</th>
                  <th data-field="password">密码</th>
                </tr>
                </thead>
              </table>
            </div>
          </div>
          <!-- /.box -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->
<#include "public/footer.ftl" >
  <div class="control-sidebar-bg"></div>
</div>
<#include "public/js.ftl" >
<#include "cust/addcust.ftl">
<script src="https://cdn.bootcss.com/bootstrap-table/1.14.2/extensions/export/bootstrap-table-export.min.js"></script>
<script>
  // 改变当前列数据样式
  function type(value,row,index){
    return '<span class="badge">'+value+'</span>';
  }

  // 改变当前列数据字体颜色
  function color(value){
    return '<span style="color:#ff704b">'+value+'</span>';
  }
  function custUpdate(value,row,index){
    //value 当前值 row 当前行数据对象 index 当前行索引
    // alert(value+','+row+','+index);
    // return "<a href='javascript:showAddCustModel("+index+");'>" + value + "</a>"
    return "<a href='javascript:void(0)' onclick='showAddCustModel("+index+")'>" + value + "</a>"
  }


  function showAddCustModel(index) {
    addCustModel_init();
    addCustModel_setValue(index) ;
    $("#addCustModel").modal("show");
  }

  function hideColumnBirth(value,row,index){
    $("#table").bootstrapTable('hideColumn', 'birth');
  }
</script>
</body>
</html>
